<template>
  <div class="tl-button-ref-container" style="margin-left: 10px">
    <slot>
      <el-button v-if="isDisplayDefaultElement" type="primary" icon="el-icon-microphone" :disabled="disabled" @click="openRefDialog">{{ `${btnTitle}[${totalCount}]` }}</el-button>
    </slot>
    <el-dialog ref="drawerRef" :title="refTitle" :visible.sync="visible" :with-header="false" :modal-append-to-body="true" :close-on-press-escape="false" :append-to-body="true" class="tl-drawer" @open="open" @close="close" :destroy-on-close="true">
      <tl-upload-list ref="uploadList" :sourceType="sourceType" :sourceId="sourceId" :isSubPage="true" v-bind="$attrs" @remindSuccess="remindSuccess" v-on="$listeners"></tl-upload-list>
    </el-dialog>
  </div>
</template>

<script>
/** mixins */
/** 子组件 */
import tlUploadList from './uploadFileList'
/** 工具类 */
import { putAction, getAction, postAction, deleteAction } from '@tapui/utils/http'
/** VUE配置 */
export default {
  components: { tlUploadList },
  data() {
    return {
      moduleTitle: '任务信息',
      url: {
        // 额外的url
        list: process.env.MEET_APT + '/meet/fileManage/list'
      },
      visible: false,
      totalCount: 0
    }
  },
  props: {
    // 标题
    refTitle: {
      type: String,
      default: '录音文件'
    },
    // 按钮标题
    btnTitle: {
      type: String,
      default: '录音'
    },
    // 是否显示默认按钮
    isDisplayDefaultElement: {
      default: true,
      type: Boolean
    },
    disabled: {
      type: Boolean,
      default: false
    },
    isSubPage: {
      type: Boolean,
      default: true
    },
    sourceType: {
      type: String,
      default: ''
    },
    sourceId: {
      type: [Number, String],
      default: ''
    }
  },
  computed: {
    isQueryCount() {
      return this.sourceId && this.sourceType
    }
  },
  watch: {
    // 当组件传入sourceid sourcetype调用list方法
    isQueryCount(val) {
      if (val) {
        this.queryCount()
      }
    }
  },
  methods: {
    openRefDialog() {
      this.visible = true
      this.$nextTick((_) => {
        this.$refs.uploadList.loadData({})
      })
    },
    open() { },
    close() { },
    /** 查询数据 */
    queryCount() {
      // 得到加载分页
      const params = {
        qry_sourceid: this.sourceId,
        qry_sourcetype: this.sourceType,
        sidx: 'recordtime',
        sord: 'desc',
        currentPage: 1,
        pageSize: 10
      }
      // 数据查询
      getAction(this.url.list, params)
        .then((res) => {
          if (res.success) {
            this.totalCount = res.result.totalCount
            this.$emit('remindSuccess', res.result.totalCount)
          } else {
            this.$tap.alert(res.message, 'warning')
          }
        })
        .catch((err) => {
          console.error(err)
        })
    },
    /** 录音文件变化后 */
    remindSuccess(fileCount) {
      this.totalCount = fileCount
    }
  }
}
</script>
